{
  const tab = document.querySelector(".container")
  const adoms = tab.querySelectorAll("nav>a");
  const divs = tab.querySelectorAll("div");
  adoms.forEach((a,index)=>{
    a.index = index;
    a.addEventListener("click",click_handle);
  });

  window.onpopstate = function(event){
    const index = event.state;
    render(index);
  }

  let currentDivDOM = null;
  let currentADOM = null;
  function click_handle(event) {
    const index = event.target.index;
    history.pushState(index,null,"/tab"+index);
    render(index);
  }

  function render(index){
    if (currentADOM)
    currentADOM.className = "";
    currentADOM = adoms[index];
    currentADOM.className = "clicked";
    if (currentDivDOM)
    currentDivDOM.className = "";
    currentDivDOM = divs[index];
    divs[index].className ="clicked";
  }
}
